Skiniko.prototype.pssHeaderDOM = function(pss, html) {
	var skiniko = this, dom = $('<div>').addClass('pssHeader').appendTo(this.pssDOM);

	if (html) dom.append(html);

	dom.
	on('mouseenter', function(e) {
		e.stopPropagation();
		$(this).addClass('pssHeaderEmfasi');
	}).
	on('mouseleave', function(e) {
		e.stopPropagation();
		if ($(this).data('keepEmfasi')) return;
		$(this).removeClass('pssHeaderEmfasi');
	}).
	append($('<div>').addClass('pssAfxomiosiBase').
		append($('<div>').addClass('pssAfxomiosiPanel').

		append($('<img>').addClass('pssAfxomiosiIcon').attr({
			src: 'ikona/misc/afxomiosi.png',
			title: 'Κυκλική αυξομείωση περιοχής',
		}).
		on('click', function(e) {
			e.stopPropagation();
			skiniko.pssAfxomiosi(pss, $(this));
		})).

		append($('<img>').addClass('pssAfxomiosiIcon').attr({
			src: 'ikona/misc/miosi.png',
			title: 'Μείωση περιοχής',
		}).
		on('click', function(e) {
			e.stopPropagation();
			skiniko.pssMiosi(pss);
		})).

		append($('<img>').addClass('pssAfxomiosiIcon').attr({
			src: 'ikona/misc/afxisi.png',
			title: 'Αύξηση περιοχής',
		}).on('click', function(e) {
			e.stopPropagation();
			skiniko.pssAfxisi(pss);
		}))).

	// Εισερχόμενοι στην περιοχή βάσης του (κρυφού) πάνελ αυξομείωσης περιοχής δημιουργούμε
	// φανερό κλώνο του βασικού πάνελ αυτξομείωσης της συγκεκριμένης περιοχής.

	on('mouseenter', function(e) {
		var panel, panelPos, pssPos, header;

		e.stopPropagation();
		header = $(this).parents('.pssHeader');
		header.data({keepEmfasi:1}).trigger('mouseenter');

		// Διαγράφουμε τυχόν εναπομείναντες κλώνους πάνελ αυξομείωσης.

		skiniko.pssDOM.find('.pssAfxomiosiPanelKlonos').remove();

		// Υπολογίζουμε και κρατάμε τη θέση του πάνελ αυξομείωσης.

		panel = $(this).find('.pssAfxomiosiPanel');
		panelPos = $(this).offset();

		// Κλωνοποιούμε το πάνελ αυξομείωσης και το τοποθετούμε στη θέση
		// του βασικού πάνελ αγκυρώνοντάς το, όμως, στη στήλη "pss" ώστε
		// να μην κινείται καθώς εκτελούμε τις αυξομειώσεις.

		panel.clone(true).appendTo(skiniko.pssDOM).
		addClass('pssAfxomiosiPanelKlonos').attr({
			title: 'Πάνελ αυξομείωσης περιοχής',
		}).css({
			position: 'fixed',
			width: $(this).outerWidth(),
			top: (panelPos.top - $(window).scrollTop() - 10) + 'px',
			left: (panelPos.left - $(window).scrollLeft()) + 'px',
		}).anadisi().

		// Βγαίνοντας από την περιοχή του πάνελ αυξομείωσης καταργούμε τελείως
		// το κλωνισμένο πάνελ αυξομείωσης.

		on('mouseleave', function(e) {
			e.stopPropagation();
			header.removeData('keepEmfasi').trigger('mouseleave');
			$(this).remove();
		}).

		// Οπλίζουμε τα πλήκτρα αυξομείωσης του κλωνισμένου πάνελ.

		find('.pssAfxomiosiIcon').
		on('mouseenter', function(e) {
			e.stopPropagation();
			$(this).addClass('pssAfxomiosiIconOplisate');
		}).
		on('mouseleave', function(e) {
			e.stopPropagation();
			$(this).removeClass('pssAfxomiosiIconOplisate');
		});
	}));

	return dom;
}

Skiniko.prototype.pssMiosi = function(miosi, tak) {
	var skiniko = this, miosi, miosiPss, miosiSize, miosiDOM, afxisi, afxisiPss, afxisiSize, afxisiDOM, dh, t = 100;

	this.afxomiosiTasi = 'pssMiosi';
	miosiPss = 'pss' + miosi;
	miosiSize = this.getOpt(miosiPss);
	miosiDOM = $('.skiniko' + miosi);

	switch (miosiSize) {
	case 1:
		dh = miosiDOM.innerHeight();
		break;
	case 2:
	case 3:
		dh = this.pssHeightSection;
		break;
	default:
		if (tak) {
			tak.finish().strofi(90, 0);
			this.pssAfxisi(miosi, tak);
		}
		return this;
	}

	switch (miosi) {
	case 'Prosklisi':
		afxisi = this.getOpt('pssSxesi') < this.getOpt('pssSizitisi') ? 'Sxesi' : 'Sizitisi';
		break;
	case 'Sxesi':
		afxisi = this.getOpt('pssProsklisi') < this.getOpt('pssSizitisi') ? 'Prosklisi' : 'Sizitisi';
		break;
	case 'Sizitisi':
		afxisi = this.getOpt('pssProsklisi') < this.getOpt('pssSxesi') ? 'Prosklisi' : 'Sxesi';
		break;
	}

	afxisiDOM = $('.skiniko' + afxisi);
	if (this.afxomiosiActive()) return this;

	miosiDOM.animate({
		height:'-='+dh+'px',
		maxHeight:'-='+dh+'px',
	}, t, function() {
		skiniko.afxomiosiReduce();
	});
	afxisiDOM.animate({
		height:'+='+dh+'px',
		maxHeight:'+='+dh+'px',
	}, t, function() {
		skiniko.afxomiosiReduce();
	});

	afxisiPss = 'pss' + afxisi;
	afxisiSize = this.getOpt(afxisiPss);
	this.setOpt(miosiPss, miosiSize - 1);
	this.setOpt(afxisiPss, afxisiSize + 1);

	return this;
}

Skiniko.prototype.pssAfxisi = function(afxisi, tak) {
	var skiniko = this, miosi, miosiPss, miosiSize, miosiDOM, afxisi, afxisiPss, afxisiSize, afxisiDOM, dh, t = 100;

	this.afxomiosiTasi = 'pssAfxisi';
	afxisiPss = 'pss' + afxisi;
	afxisiSize = this.getOpt(afxisiPss);
	afxisiDOM = $('.skiniko' + afxisi);

	switch (afxisi) {
	case 'Prosklisi':
		miosi = this.getOpt('pssSxesi') > this.getOpt('pssSizitisi') ? 'Sxesi' : 'Sizitisi';
		break;
	case 'Sxesi':
		miosi = this.getOpt('pssProsklisi') > this.getOpt('pssSizitisi') ? 'Prosklisi' : 'Sizitisi';
		break;
	case 'Sizitisi':
		miosi = this.getOpt('pssProsklisi') > this.getOpt('pssSxesi') ? 'Prosklisi' : 'Sxesi';
		break;
	}

	miosiDOM = $('.skiniko' + miosi);
	miosiPss = 'pss' + miosi;
	miosiSize = this.getOpt(miosiPss);
	switch (miosiSize) {
	case 1:
		dh = miosiDOM.innerHeight();
		break;
	case 2:
	case 3:
		dh = this.pssHeightSection;
		break;
	default:
		if (tak) {
			tak.finish().strofi(0, 90);
			this.pssMiosi(afxisi, tak);
		}
		return this;
	}

	if (this.afxomiosiActive()) return this;

	miosiDOM.animate({
		height:'-='+dh+'px',
		maxHeight:'-='+dh+'px',
	}, t, function() {
		skiniko.afxomiosiReduce();
	});
	afxisiDOM.animate({
		height:'+='+dh+'px',
		maxHeight:'+='+dh+'px',
	}, t, function() {
		skiniko.afxomiosiReduce();
	});

	this.setOpt(miosiPss, miosiSize - 1);
	this.setOpt(afxisiPss, afxisiSize + 1);

	return this;
}

Skiniko.prototype.pssAfxomiosi = function(pss, icon) {
	var tasi = this.afxomiosiTasi;
	if (!tasi) tasi = 'pssAfxisi';
	return this[tasi](pss, icon);
}

Skiniko.prototype.afxomiosiActive = function() {
	var afxomiosi = this.afxomiosi;
	if (afxomiosi) return true;

	this.afxomiosi = 2;
	return false;
}

Skiniko.prototype.afxomiosiReduce = function() {
	this.afxomiosi--;
	return this;
}
